﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="../Scripts/jquery.js"></script>
    <script type="text/javascript" src="../Scripts/Verify.js"></script>
    <link href="../Styles/Public.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        fieldset
        {
            width: 500px;
            position: relative;
        }
        .imgBox
        {
            position: absolute;
            float: right;
            top: 10px;
            right: 10px;
            width: 200px;
        }
        .imgBox .fileinput
        {
            width: 100%;
        }
        span
        {
            font-size: 12px;
            color: #666;
        }
    </style>
</head>
<body>
    <div>
        /*!<br />
        * 主 题：《表单录入验证》<br />
        * 说 明：通过控件属性实现验证，包括生成星号标注、非法提示等；<br />
        * 功能描述：<br />
        * 1、当录入框必填时，在控件后生成红色星号（设置star=false时不显示星号）；<br />
        * 2、根据控件属性判断需要录入的数据格式，如果非法则阻止提交并弹出提示<br />
        * 3、支持分组验证<br />
        * 4、可脱离微厦在线学习系统独立使用（需要JQuery库支持）<br />
        *<br />
        * 作 者：微厦科技_宋雷鸣_10522779@qq.com<br />
        */</div>
    <fieldset>
        <legend>验证控件使用示例</legend>
        <form onsubmit="alert('验证成功');return false;">
        <p>
            账号：
            <input name="" type="text" nullable="false" datatype="user" />
        </p>
        <p>
            姓名：
            <input name="" type="text" size="6" datatype="chinese" lenlimit="2-4" alt="限2至4个中文字/符"><span>（限中文）</span>
        </p>
        <p>
            年龄：
            <input type="text" size="4" datatype="uint" nullable="false" place="right" />
        </p>
        <p>
            电话：
            <input type="text" datatype="mobile|tel" alt="请输入正确的电话号码">
        </p>
        <p>
            邮箱：
            <input type="text" datatype="email" />
        </p>
        <p>
            学历：
            <select name="select" style="height:25px" nullable="false" alt="请选择学历" place="right">
                <option value="">--请选择--</option>
                <option value="5">硕士</option>
                <option value="4">本科</option>
                <option value="3">专科</option>
                <option value="2">中学</option>
                <option value="1">小学</option>
            </select>
        </p>
        <p>
            <input type="submit" name="button" class="button" value="验证表单" verify="true" />
        </p>
        <div class="imgBox">
            照片：<br />
            <img src="" width="100" height="100" class="photo" /><br />
            <input name="" type="file" fileallow="jpg|png" class="fileinput" />
            <br />
            <span>（仅限jpg、png图片）</span>
        </div>
        </form>
    </fieldset>
    <p>&nbsp;</p>
    <p>下载地址：<a href="https://github.com/weishakeji/Verify_Js" target="_blank">https://github.com/weishakeji/Verify_Js</a></p>
    
</body>
</html>
